<div [class]="model.cssClasses.selectWrapper" (click)="click($event)">
    <div *ngIf="!model.isReadOnly" [attr.tabindex]="dropdownModel.noTabIndex ? null : 0"
        [class]="model.getControlClass()" [attr.disabled]="model.isDisabledAttr ? true : null" (blur)="blur($event)"
        (keydown)="keyhandler($event)" [attr.id]="model.inputId" [attr.role]="dropdownModel.ariaQuestionRole"
        [attr.aria-required]="dropdownModel.ariaQuestionRequired" [attr.aria-label]="dropdownModel.ariaQuestionLabel"
        [attr.aria-labelledby]="dropdownModel.ariaQuestionLabelledby"
        [attr.aria-describedby]="dropdownModel.ariaQuestionDescribedby"
        [attr.aria-invalid]="dropdownModel.ariaQuestionInvalid"
        [attr.aria-errormessage]="dropdownModel.ariaQuestionErrorMessage"
        [attr.aria-controls]="dropdownModel.ariaQuestionControls"
        [attr.aria-expanded]="dropdownModel.ariaQuestionExpanded"
        [attr.aria-activedescendant]="dropdownModel.ariaQuestionActivedescendant">
        <div [class]="model.cssClasses.controlValue">
            <ng-container *ngIf="!model.isEmpty()">
                <sv-ng-tagbox-item *ngFor="let item of model.selectedChoices" [item]="item" [question]="model">
                </sv-ng-tagbox-item>
            </ng-container>
            <ng-template *ngIf="dropdownModel.needRenderInput"
                [component]="{ name: 'sv-tagbox-filter', data: { model: dropdownModel, question: model } }"></ng-template>
        </div>
        <sv-ng-action-bar [model]="dropdownModel.editorButtons"></sv-ng-action-bar>
    </div>
    <sv-ng-popup *ngIf="!model.isInputReadOnly" [popupModel]="model.popupModel"></sv-ng-popup>
    <div *ngIf="model.isReadOnly" [class]="model.getControlClass()" [attr.id]="model.inputId"
        [attr.tabindex]="model.isDisabledAttr ? null : 0" [attr.disabled]="model.isDisabledAttr ? true : null"
        [attr.role]="dropdownModel?.ariaQuestionRole" [attr.aria-label]="dropdownModel?.ariaQuestionLabel"
        [attr.aria-labelledby]="dropdownModel?.ariaQuestionLabelledby"
        [attr.aria-describedby]="dropdownModel?.ariaQuestionDescribedby" [attr.aria-expanded]="false"
        [attr.aria-readonly]="true" [attr.aria-disabled]="true">
        <div [class]="model.cssClasses.controlValue">
            <sv-ng-string *ngIf="model.locReadOnlyText" [model]="model.locReadOnlyText"></sv-ng-string>
        </div>
        <sv-ng-action-bar [model]="dropdownModel.editorButtons"></sv-ng-action-bar>
    </div>
</div>